Ext.setup({
	
	/* Loading parameters */
	icon: 'resources/images/icon.png',
	tabletStartupScreen: 'resources/images/tablet_startup.png',
	phoneStartupScreen: 'resources/images/phone_startup.png',
	glossOnIcon: false,
	
	onReady: function() {
	
		/* Modele */
        Ext.regModel('login', {
            fields: [
                {name: 'number', type: 'string'},
                {name: 'password', type: 'password'},
                {name: 'remember', type: 'boolean', defaultValue: false},
                {name: 'lang', type: 'string', defaultValue: 'fr'}
            ],
            validations: [
                {type: 'presence', field: 'number', message:'Numéro requis'},
                {type: 'presence', field: 'password', message : 'Mot de passe requis'}
                //{type: 'format',   name: 'email', matcher: /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/, message:"Wrong Email Format"},
                //{type : 'password', field:'password'}
            ]
        });
		
		/* Login Page */
		var loginForm = new Ext.form.FormPanel({
			fullscreen: true,
			scroll: 'vertical',
			url: 'login.php',
			standardSubmit: false,
			
			listeners: {
				submit: function(loginForm, result){
					//console.log(result);
					//alert('sucess; '+ result.responseText);*
					loginForm.hide();
				},
				exception: function(loginForm, result){
					console.log(result);
					console.log('failure', Ext.toArray(arguments));
					//alert('failure; '+ result);
					//alert('failure; '+ result.responseText);
				}
			},
			
			/* Elements internes */
			items: [{

				/* Fieldset d'identification */
				xtype: 'fieldset',
				title: 'Identification',
				defaults: {
					//required: true,
					labelAlign: 'left',
					labelWidth: '45%'
				},
					
				items: [{
					xtype: 'textfield',
					name : 'number',
					label: 'Numéro',
					required: true,
					useClearIcon: true,
					autoCapitalize : false
				}, {
					xtype: 'passwordfield',
					name : 'password',
					label: 'Mot de passe',
					required: true,
					useClearIcon: false
				},{
					xtype: 'togglefield',
					name: 'remember',
					label: 'Mémoriser'
				}]
				
			},{
				/* Fieldset de choix de langue */
				xtype: 'fieldset',
				defaults: {
					labelAlign: 'left',
					labelWidth: '45%'
				},
					
				items: [{
					xtype: 'selectfield',
					name: 'lang',
					label: 'Langue',
					options: [
						{text: 'Français',  value: 'fr'},
						{text: 'Anglais',  value: 'en'},
						{text: 'Espagnol',  value: 'es'}
					]
				}]
			
			}],
			
			/* Elements dockés */
			dockedItems: [{
				dock: 'bottom',
				xtype: 'toolbar',
				items: [{
					text: 'Mot de passe perdu ?',
					handler: function() {
						rootPanel.setActiveItem(lostForm);
					}
				},{
					xtype: 'spacer'
				},{
					text: 'Valider',
					ui: 'confirm-round',
					handler: function() {
						/* TODO */
						var model = Ext.ModelMgr.create(loginForm.getValues(),'login');
						var errors = model.validate();
						
						if(errors.isValid()){
							// Si le formulaire est valide
						}else{
							var errorMsg = '';
							Ext.each(errors.items, function(error){errorMsg += error.message+"<br>";});
							Ext.Msg.alert('Erreur d\'identification', errorMsg);
						}
						
						//loginForm.submit();
					}
				}]
			}]
			
		})
		
		/* LostPassword Page */
		var lostForm = new Ext.form.FormPanel({
			fullscreen: true,
			scroll: 'vertical',
			url: 'lost.php',
			standardSubmit: false,
			
			/* Elements internes */
			items: [{

				/* Fieldset de récupération de password */
				xtype: 'fieldset',
				title: 'Récupération',
				instructions: 'Un email contenant votre numéro d\'identifiant ainsi que votre mot de passe va vous être envoyé.',
				defaults: {
					//required: true,
					labelAlign: 'left',
					labelWidth: '45%'
				},
		
				items: [{
					xtype: 'textfield',
					name : 'email',
					label: 'Email',
					required: true,
					useClearIcon: true,
					autoCapitalize : false
				}]
			}],
			
			/* Elements dockés */
			dockedItems: [{
				dock: 'bottom',
				xtype: 'toolbar',
				items: [{
					text: 'Retour',
					ui: 'back',
					handler: function() {
						rootPanel.setActiveItem(loginForm);
					}
				},{
					xtype: 'spacer'
				},{
					text: 'Envoyer',
					ui: 'confirm-round',
				
					handler: function() {
						/* TODO */
						console.log(lostForm.getValues());
						loginForm.submit();
					}
				}]
			}]
		})		
				
				
				
		
		
		
		
		/* Présentations différentes 
		if(Ext.is.Phone) {
			Ext.apply(loginForm, {fullscreen: true});
		} else {
			Ext.apply(loginForm, {
				autoRender: true,
				floating: true,
				modal: true,
				centered: true,
				hideOnMaskTap: false,
				height: 960,
				width: 640
			});
		}*/
		
		var rootPanel = new Ext.Panel({
			fullscreen: true,
			layout: 'card',
			items: [loginForm, lostForm],
			dockedItems: [
				{
					/* Entete */
					dock: 'top',
					title: 'head',
					html: '<h1>OpenTel</h1>Concepteur en solutions telecom',
					cls: 'titre'
				}
			]
		})
		
		rootPanel.show();
		//loginForm.show();
		
	}
});


	
/*
        var form;
        
        Ext.apply(Ext.data.validations,{
            passwordMessage: 'Password Entered is wrong',
            password: function(config, value) {
                if(value == "test"){
                    return true;
                } else {
                    return false;
                }
            }
        });
        
        Ext.regModel('User', {
            fields: [
                {name: 'name',     type: 'string'},
                {name: 'password', type: 'password'},
                {name: 'email',    type: 'string'}
            ],
            validations: [
                {type: 'presence', name: 'name',message:"Enter Name"},
                {type: 'presence', name: 'password', message : "Enter Password"},
                {type: 'format',   name: 'email', matcher: /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/, message:"Wrong Email Format"},
                {type : 'password', name:'password'}
            ]
        });
        
        var formBase = {
            scroll: 'vertical',
            url   : 'postUser.php',
            standardSubmit : false,
            items: [
                {
                    xtype: 'fieldset',
                    title: 'Personal Info',
                    instructions: 'Please enter the information above.',
                    defaults: {
                        required: true,
                        labelAlign: 'left',
                        labelWidth: '40%'
                    },
                    items: [
                    {
                        xtype: 'textfield',
                        name : 'name',
                        label: 'Name',
                        useClearIcon: true,
                        autoCapitalize : false
                    }, {
                        xtype: 'passwordfield',
                        name : 'password',
                        label: 'Password',
                        useClearIcon: false
                    }, {
                        xtype: 'emailfield',
                        name : 'email',
                        label: 'Email',
                        placeHolder: 'you@sencha.com',
                        useClearIcon: true
                    }]
                }
            ],
            dockedItems: [
                {
                    xtype: 'toolbar',
                    dock: 'bottom',
                    items: [
                        {
                            text: 'Load Model',
                            ui: 'round',
                            handler: function() {
                                formBase.user = Ext.ModelMgr.create({
                                    'name'    : 'Akura',
                                    'password': 'secret',
                                    'email'   : 'saru@sencha.com'
                                }, 'User');
        
                                form.loadModel(formBase.user);
                            }
                        },
                        {xtype: 'spacer'},
                        {
                            text: 'Reset',
                            handler: function() {
                                form.reset();
                            }
                        },
                        {
                            text: 'Save',
                            ui: 'confirm',
                            handler: function() {
                                var model = Ext.ModelMgr.create(form.getValues(),'User');
                                
                                var errors = model.validate(),message = "";
                                if(errors.isValid()){
                                    
                                    if(formBase.user){
                                    form.updateRecord(formBase.user, true);
                                    }
                                    form.submit({
                                        waitMsg : {message:'Submitting', cls : 'demos-loading'}
                                    });
                                    
                                } else {
                                    Ext.each(errors.items,function(rec,i){
                                        message += rec.message+"<br>";
                                    });
                                    Ext.Msg.alert("Validate", message, function(){});
                                    return false;
                                }
                            }
                        }
                    ]
                }
            ]
        };
        
        if (Ext.is.Phone) {
            formBase.fullscreen = true;
        } else {
            Ext.apply(formBase, {
                autoRender: true,
                floating: true,
                modal: true,
                centered: true,
                hideOnMaskTap: false,
                height: 960,
                width: 640
            });
        }
        
        form = new Ext.form.FormPanel(formBase);
        form.show();
*/